import Vue from "vue";
import Vuex from "vuex";
import createPersistedState from "vuex-persistedstate";

// 应用Vux插件
Vue.use(Vuex);

//1. state用于存放数据
const state = {
    userInfo: {},
    tagNavList: [],
};
// 2.getter用于state中数据加工
const getters = {
    isLogin(state) {
        return Boolean(state.userInfo?.token);
    },
    getToken(state) {
        return state.userInfo?.token || "";
    },
    getAuthList(state) {
        return state.userInfo?.auth_list || [];
    },
    getTagNavList(state) {
        return state.tagNavList || [];
    },
};
// 3.mutations用于操作数据
const mutations = {
    // 修改用户信息
    updateUserInfo(state, val) {
        state.userInfo = val;
    },
    updateTagNavList(state, val) {
        state.tagNavList = val;
    },
};
// 4.actions用于响应组件中的动作
const actions = {
    updateUserInfo(content, val) {
        content.commit("updateUserInfo", val);
    },
    updateTagNavList(content, val) {
        content.commit("updateTagNavList", val);
    },
    doLoginOut(content, val) {
        content.commit("updateUserInfo", {});
        content.commit("updateTagNavList", []);
    },
};
// 创建并暴露store
export default new Vuex.Store({
    state,
    getters,
    mutations,
    actions,
    plugins: [
        createPersistedState({
            storage: window.localStorage,
        }),
    ],
});
